<template>
	<div>
		<el-form
			:model="form"
			:rules="rules"
			ref="formRef"
			label-width="300px"
			label-position="left"
			:inline="true"
		>
			<el-form-item label="二轮摩托车或自行车质量 (m1)" prop="m1">
				<el-input class="ipt" v-model="form.m1" />
			</el-form-item>
			<el-form-item label="被抛出的角度 (o1Degrees)" prop="o1Degrees">
				<el-input class="ipt" v-model="form.o1Degrees" />
			</el-form-item>
			<el-form-item label="重力加速度 (g)" prop="g">
				<el-input class="ipt" v-model="form.g" />
			</el-form-item>
			<el-form-item label="车体与路面摩擦系数 (o1)" prop="o1">
				<el-input class="ipt" v-model="form.o1" />
			</el-form-item>
			<el-form-item label="碰撞后的滑移距离 (s1)" prop="s1">
				<el-input class="ipt" v-model="form.s1" />
			</el-form-item>
			<el-form-item label="骑车人质量 (mp)" prop="mp">
				<el-input class="ipt" v-model="form.mp" />
			</el-form-item>
			<el-form-item label="骑车人与地面的摩擦系数 (op)" prop="op">
				<el-input class="ipt" v-model="form.op" />
			</el-form-item>
			<el-form-item label="骑车人被抛出的角度 (opDegrees)" prop="opDegrees">
				<el-input class="ipt" v-model="form.opDegrees" />
			</el-form-item>
			<el-form-item label="碰撞时骑车人的质心高度 (h)" prop="h">
				<el-input class="ipt" v-model="form.h" />
			</el-form-item>
			<el-form-item label="碰撞后的滑移距离 (sp)" prop="sp">
				<el-input class="ipt" v-model="form.sp" />
			</el-form-item>
			<el-form-item label="汽车质量 (m2)" prop="m2">
				<el-input class="ipt" v-model="form.m2" />
			</el-form-item>
			<el-form-item label="汽车的滑动附着系数 (o2)" prop="o2">
				<el-input class="ipt" v-model="form.o2" />
			</el-form-item>
			<el-form-item label="汽车附着系数修正值 (k2)" prop="k2">
				<el-input class="ipt" v-model="form.k2" />
			</el-form-item>
			<el-form-item label="碰撞后的滑移距离 (s2)" prop="s2">
				<el-input class="ipt" v-model="form.s2" />
			</el-form-item>
		</el-form>
		<div style="margin-top: 50px">
			<el-button type="primary" @click="calculateSpeed">计算车速</el-button>
		</div>
		<el-alert
			v-if="result !== null"
			title="计算结果"
			:closable="false"
			type="success"
			:description="'车速 (V) = ' + result.toFixed(2) + ' km/h'"
		/>
	</div>
</template>

<script lang="ts" setup>
import { ref } from "vue";
const formRef = ref(null);
const form = ref({
	m1: null,
	o1Degrees: null,
	g: null,
	o1: null,
	s1: null,
	mp: null,
	op: null,
	opDegrees: null,
	h: null,
	sp: null,
	m2: null,
	o2: null,
	k2: null,
	s2: null
});

const result = ref(null);

const rules = {
	m1: [{ required: true, message: "请输入 m1", trigger: "blur" }],
	o1Degrees: [{ required: true, message: "请输入 o1Degrees", trigger: "blur" }],
	g: [{ required: true, message: "请输入 g", trigger: "blur" }],
	o1: [{ required: true, message: "请输入 o1", trigger: "blur" }],
	s1: [{ required: true, message: "请输入 s1", trigger: "blur" }],
	mp: [{ required: true, message: "请输入 mp", trigger: "blur" }],
	op: [{ required: true, message: "请输入 op", trigger: "blur" }],
	opDegrees: [{ required: true, message: "请输入 opDegrees", trigger: "blur" }],
	h: [{ required: true, message: "请输入 h", trigger: "blur" }],
	sp: [{ required: true, message: "请输入 sp", trigger: "blur" }],
	m2: [{ required: true, message: "请输入 m2", trigger: "blur" }],
	o2: [{ required: true, message: "请输入 o2", trigger: "blur" }],
	k2: [{ required: true, message: "请输入 k2", trigger: "blur" }],
	s2: [{ required: true, message: "请输入 s2", trigger: "blur" }]
};

const calculateSpeed = () => {
	formRef.value.validate((valid) => {
		if (valid) {
			const { m1, o1Degrees, g, o1, s1, mp, op, opDegrees, h, sp, m2, o2, k2, s2 } =
				form.value;

			const toRadians = (degrees) => degrees * (Math.PI / 180);
			const o1Radians = toRadians(o1Degrees);
			const opRadians = toRadians(opDegrees);

			const numerator1 = m1 * Math.sin(o1Radians) * Math.sqrt(2 * g * o1 * s1);
			const numerator2 =
				mp *
				Math.sqrt(2 * g) *
				op *
				Math.sin(opRadians) *
				(Math.sqrt(h + sp / op) - Math.sqrt(h));
			const numerator3 = m2 * Math.sqrt(2 * g * o2 * k2 * s2);

			const V = ((numerator1 + numerator2 + numerator3) * 3.6) / m2;

			result.value = V;
		}
	});
};
</script>
<style scoped>
.ipt {
	width: 120px;
}
</style>
